<!DOCTYPE html>
<html
        xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout" xmlns:th="http://www.thymeleaf.org"
        layout:decorate="~{base/layout}">
<div layout:fragment="content">
    <!--header wrapper end-->
    <!--med_tittle_section-->
    <div class="med_tittle_section">
        <div class="med_img_overlay"></div>
        <div class="container">
            <div class="row">
                <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
                    <div class="med_tittle_cont_wrapper">
                        <div class="med_tittle_cont">
                            <ol class="breadcrumb">
                                <li><a th:href="@{/}">便民信息</a></li>
                                <li><a th:href="@{/}"></a>招工就业</li>
                                <li><a th:href="@{/}"></a>详情</li>
                            </ol>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- med_tittle_section End -->
    <!--service section start-->
    <div class="page-container">
        <div class="container">
            <div class="row med_toppadder50 med_bottompadder50">
                <div class="col-lg-9 col-md-9 col-sm-8 col-xs-12">
                    <div class="news-detail-box">
                        <h3 th:text="${informationRecruitment.company}"></h3>
                        <div class="author-info">
                            <span class="iconfont icon-shijian-yuan" th:marginwidth="0"></span>
                            <span th:text="${#calendars.format(informationRecruitment.updateTime,'yyyy-MM-dd')}"></span>&nbsp;&nbsp;
                            <span class="iconfont icon-dingwei"></span>
                            <span th:text="${informationRecruitment.address}"></span>&nbsp;&nbsp;
                            <span class="iconfont icon-chakan"></span>
                            <span>13</span>
                        </div>
                        <div class="news-detail-content">
                            <div class="company-class">
                                <img th:src="@{'/images/'+ ${informationRecruitment.image} +'.jpg'}">
                            </div>
                            <div><h5>
                                <div class="iconfont-class">
                                    <span class="iconfont icon-mubiao"></span>
                                    <span th:text="'招聘单位：'+${informationRecruitment.company}"></span></div>
                                <div class="iconfont-class">
                                    <span class="iconfont icon-dingwei"></span>
                                    <span th:text="'单位地址：'+${informationRecruitment.address}"></span></div>
                                <div class="iconfont-class">
                                    <span class="iconfont icon-geren"></span>
                                    <span th:text="'联系人：'+${informationRecruitment.name}"></span></div>
                                <div class="iconfont-class">
                                    <span class="iconfont icon-dianhua"></span>
                                    <span th:text="'联系方式：'+${informationRecruitment.telephone}"></span></div>
                            </h5></div>
                            <div class="describe-class">
                                <h5>
                                    <span class="iconfont icon-chakan"></span>
                                    <span th:text="招聘详细描述+'：'" style="font-size: 20px;font-weight: bold;"></span>
                                </h5>
                                <p id="editorContent" style="font-size: 15px;line-height: 30px;" th:text="${informationRecruitment.describe}">
                                </p>
                            </div>
<!--                            <div  class="img-div" style="text-align: center">-->
<!--                                <img th:src="@{'/images/'+ ${informationRecruitment.image} +'.jpg'}">-->
<!--                            </div>-->

                            <div align="right" style="float:right">
                                <button th:if="${flag == false}" id = "contactPushUser" th:attr="recruitment-id = ${informationRecruitment.id}"
                                        type="button" class="btn btn-default btn-info">立即联系
                                </button>
                                <button th:if="${flag == true }" id="uploadMyRecruitment"
                                        type="button" class="btn btn-default btn-info" th:attr="recruitment-id = ${informationRecruitment.id}">编辑
                                </button>
                            </div>
                        </div>
                    </div>
<!--                    编辑招工就业弹窗-->
                    <div class="modal fade" id="updateRecruitmentModal">
                        <div class="modal-dialog modal-lg" role="document">
                            <div class="modal-content">
                                <div class="modal-header">
                                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
                                            aria-hidden="true">&times;</span></button>
                                    <h4 class="modal-title" id="exampleModalLabel">编辑招工就业信息</h4>
                                </div>
                                <div class="modal-body">
                                    <form method="post" name="insertMember"
                                          id="insertMember" class="form-horizontal" enctype="multipart/form-data">
                                        <!--隐藏的-->
                                        <!--<input type="text" id="id" name="id" hidden>-->

                                        <div id="companyDiv" class="form-group m-b-10" style="text-align:right">
                                            <label class="col-sm-2 control-label">
                                                <label style="color: red">*</label>招聘单位:
                                            </label>
                                            <div class="col-sm-6">
                                                <input type="text" class="form-control" id="company" name="company">
                                                <span class="help-block"></span>
                                            </div>
                                        </div>
                                        <div id="addressDiv" class="form-group m-b-10" style="text-align:right">
                                            <label class="col-sm-2 control-label">
                                                <label style="color: red">*</label>单位地址:
                                            </label>
                                            <div class="col-sm-6">
                                                <input type="text" class="form-control" id="address" name="address">
                                                <span class="help-block"></span>
                                            </div>
                                        </div>
                                        <div id="nameDiv" class="form-group m-b-10" style="text-align:right">
                                            <label class="col-sm-2 control-label">
                                                <label style="color: red">*</label>联系人:
                                            </label>
                                            <div class="col-sm-6">
                                                <input type="text" class="form-control" id="name" name="name">
                                                <span class="help-block"></span>
                                            </div>
                                        </div>
                                        <div id="telephoneDiv" class="form-group m-b-10" style="text-align:right">
                                            <label class="col-sm-2 control-label">
                                                <label style="color: red">*</label>联系方式:
                                            </label>
                                            <div class="col-sm-6">
                                                <input type="text" class="form-control" id="telephone" name="telephone">
                                                <span class="help-block"></span>
                                            </div>
                                        </div>
<!--                                        <div class="form-group m-b-10" style="text-align:right">-->
<!--                                            <label class="col-sm-2 control-label">-->
<!--                                                招聘描述:-->
<!--                                            </label>-->
<!--                                            <div class="col-sm-10">-->
<!--                                                <textarea type="text" rows="7" cols="20" class="form-control" id="describe" name="describe">-->
<!--                                                </textarea>-->
<!--                                                <span class="help-block"></span>-->
<!--                                            </div>-->
<!--                                        </div>-->
                                        <div class="form-group m-b-10">
                                            <label class="col-sm-2 control-label">招聘描述：</label>
                                            <div class="col-sm-10">
                                                <div id="updateDescEditor"></div>
                                                <input type="text" name="recruitmentDesc" id="updateRecruitmentDesc"
                                                       style="display: none" />
                                            </div>
                                        </div>
                                        <div class="form-group m-b-10" style="text-align:left">
                                            <label class="col-sm-2 control-label">招聘状态：</label>
                                            <div class="col-sm-6">
                                                <div class="example-box">
                                                    <label class="lyear-radio radio-inline"> <input
                                                            type="radio" name="type"
                                                            value="0" checked="checked"><span>招聘中</span>
                                                    </label> <label class="lyear-radio radio-inline"> <input
                                                        type="radio" name="type"
                                                        value="1"> <span>已招聘</span>
                                                </label>
                                                </div>
                                            </div>
                                        </div>
                                        <div id="imageDiv" class="form-group m-b-10" style="text-align:right">
                                            <label class="col-sm-2 control-label">
                                                上传图片:
                                            </label>
                                            <div class="col-sm-6">
                                                <input type="file" id="file" name="file" onchange="uploadFile()" th:attr="testName='example'">
                                                <!-- <button type="button" id="uploadFile" value="确认" th:attr="uploadFileName='example'">确认</button>-->
                                                <img id="imagePosition" style="width: 100px !important; display: inherit">
                                                <span class="help-block"></span>
                                            </div>
                                        </div>
                                    </form>
                                </div>
                                <div class="modal-footer">
                                    <button type="button" class="btn btn-default" data-dismiss="modal">返回</button>
                                    <button type="button" class="btn btn-info" onclick="saveForm()" id="update-recruitment-btn" th:attr="update-recruitment-id=0">保存</button>
                                </div>
                            </div>
                        </div>
                    </div>

<!--                    立即联系弹窗-->

                </div>
                <div class="col-lg-3 col-md-3 col-sm-4 col-xs-12">
                    <div class="sider-card">
                        <div class="sider-card-header">
                            <h3>热门乡镇建筑</h3>
                        </div>
                        <ul class="sider-list-model-a">
                            <li th:each="building:${top10Building}">
                                <a th:href="@{/attractions/buildingDetailsUI(id=${building.id})}" th:text="${building.name}"></a>
                            </li>
                        </ul>
                    </div>
                    <div class="sider-card">
                        <div class="sider-card-header">
                            <h3>热门酒店</h3>
                        </div>
                        <ul class="sider-list-model-a">
                            <li th:each="waterScape:${top10Waterscape}">
                                <a th:href="@{/reserve/hotelDetailsUI(id=${waterScape.id})}" th:text="${waterScape.name}"></a>
                            </li>
                        </ul>
                    </div>
                </div>

            </div>
        </div>
    </div>
    <!--service section end-->
    <script th:src="@{/js/jquery_min.js}"></script>
    <script th:src="@{/js/bootstrap.min.js}"></script>
    <script th:src="@{/js/wow.min.js}"></script>
    <script th:src="@{/js/custom.js}"></script>
    <script th:src="@{/plugins/slider-pro/js/jquery.sliderPro.min.js}"></script>
    <script th:src="@{/plugins/owlcarousel/js/owl.carousel.min.js}"></script>
    <script th:src="@{/layer/layer.js}"></script>
    <!--富文本编辑框js-->
    <script th:src="@{/js2/wangEditor.js}"></script>
    <script th:inline="javascript" type="text/javascript">
        window.onload = function (){
            $("#editorContent").html($("#editorContent").text());
            console.log($("#editorContent").text());
        }
        $(document).on("click", "#contactPushUser", function () {
            $.ajax({
                url: "/platform/information/getData?id=" + $("#contactPushUser").attr("recruitment-id"),
                type: "GET",
                success: function (result) {
                    var chatData = result.extend.chatData;
                    location.href = "/platform/intoChat?linkId="+chatData.linkId + "&toName=" + chatData.toName;
                    // location.href = "/platform/intoChat?linkId="+$("#contactPushUser").attr("linkId") + "&toName=" + $("#contactPushUser").attr("toName");
                }
            });

        });

        // 弹出招工就业信息编辑框
        $(document).on("click", "#uploadMyRecruitment", function () {
            getRecruitmentInfo($(this).attr("recruitment-id"));
            //把招工就业的id传递给模态框的更新按钮
            $("#update-recruitment-btn").attr("update-recruitment-id", $(this).attr("recruitment-id"));
            // console.log($("#update-recruitment-btn").attr("update-recruitment-id"));
            $("#updateRecruitmentModal").modal({
                backdrop: "static"
            });
        });

        // 根据id招工就业 获取招工就业信息并显示
        function getRecruitmentInfo(id){
            $.ajax({
                url: "/platform/information/getRecruitmentById?id=" + id,
                type: "GET",
                success: function (result) {
                    var informationRecruitment = result.extend.informationRecruitment;

                    //显示数据之前先清除一下校验样式，如果有的话
                    reset_form("#updateRecruitmentModal form");

                    $("#company").val(informationRecruitment.company);
                    $("#address").val(informationRecruitment.address);
                    $("#name").val(informationRecruitment.name);
                    $("#telephone").val(informationRecruitment.telephone);
                    $("#describe").val(informationRecruitment.describe);
                    $("#updateRecruitmentModal input[name=type]").val([informationRecruitment.status]);
                    if (null != informationRecruitment.image&& informationRecruitment.image != ""){
                        $("#imagePosition").attr("src", "/platform/images/" + informationRecruitment.image + ".jpg");
                        $("#file").attr("testName", informationRecruitment.image);
                    }

                    //初始化富文本编辑框
                    var E2 = window.wangEditor;
                    var editor2 = new E2('#updateDescEditor');
                    editor2.customConfig.zIndex = 100;
                    editor2.customConfig.onchange = function(html) {
                        // 监控变化，同步更新到 textarea
                        //alert(html);
                        textArea = html;
                        $("#updateDescEditor").val(html);
                        $("#updateRecruitmentDesc").val(html);
                        //alert($("#divEditor").val());
                    };
                    editor2.create();
                    editor2.txt.html(informationRecruitment.describe);
                    $("#updateRecruitmentDesc").val(editor2.txt.html());
                    // console.log(editor2.txt.html());

                }
            });
        }

        // 点击保存招工就业信息
        function saveForm(){
            var company = $('#company').val();
            var address = $('#address').val();
            var name = $('#name').val();
            var telephone = $('#telephone').val();
            var describe = $('#updateRecruitmentDesc').val();
            var image = $("#file").attr("testName");
            console.log($("#update-recruitment-btn").attr("update-recruitment-id"));
            if (company.length === 0) {
                show_validate_msg("#company",
                    "error", "招聘单位不能为空");
                return false;
            }
            if (address.length === 0) {
                show_validate_msg("#address",
                    "error", "单位地址不能为空");
                return false;
            }
            if (name.length === 0) {
                show_validate_msg("#name",
                    "error", "联系人不能为空");
                return false;
            }
            if (telephone.length === 0) {
                show_validate_msg("#telephone",
                    "error", "联系方式不能为空");
                return false;
            }

            $.ajax({
                url: '/platform/information/updateRecruitment?id='+$("#update-recruitment-btn").attr("update-recruitment-id"),
                // data: $("#exampleModal form").serialize(),
                data: {
                    "company":company,
                    "address":address,
                    "name":name,
                    "telephone":telephone,
                    "describe":describe,
                    "status":$("#updateRecruitmentModal input:radio:checked").val(),
                    "image": image
                    // "file": file
                },
                // data: formData,
                type: 'put',
                dataType: 'json',
                success: function (result) {
                    if (result.code === 100) {
                        $("#exampleModal").modal('hide');
                        window.alert('招工就业信息修改成功！');
                        setTimeout(function () {
                            location.href = "/platform/information/recruitmentDetailsUI?id="+ $("#update-recruitment-btn").attr("update-recruitment-id");
                        }, 1000);
                    } else {
                        layer.open({
                            title: '招工就业信息修改失败！',
                            content: result.message
                        });
                        // window.alert('招工就业信息提交失败！');
                    }
                }
            })
        }


        // 选择文件后提交
        function uploadFile(){
            var file = $("#file")[0].files[0];
            var formData = new FormData();
            formData.append("file", file);
            // $("#imagePosition").attr("src", "/platform/images/" + file.name);
            $("#file").attr("testName", file.name.substring(0, file.name.indexOf(".")));
            console.log($("#file").attr("testName"));
            $.ajax({
                url: '/platform/information/uploadFile',
                type: 'post',
                data: formData,
                processData: false,
                contentType: false,
                cache: false,
                success:function (result){
                    if (result.code === 100) {
                        window.alert("图片提交成功");
                        $("#imagePosition").attr("src", "/platform/images/" + file.name);
                    }else {
                        window.alert("图片提交失败");
                    }
                }
            })
        }

        //清空表单样式及内容
        function reset_form(ele) {
            $(ele)[0].reset();
            //清空表单样式
            $(ele).find("*").removeClass("has-error has-success");
            $(ele).find(".help-block").text("");
        }

        function cancelAttractionsReserve(id, str) {
            $.ajax({
                url: '/travel/reserve/cancelAttractionsReserve',
                data: {"id": id},
                type: 'post',
                dataType: 'json',
                success: function (result) {
                    if (result.code === 200) {
                        if(str == '预订'){
                            confirm(str + "成功!"); //在页面上弹出对话框
                            window.location.href = "/travel/reserve/reserveManageUI";
                        }else{
                            confirm(str + "成功!"); //在页面上弹出对话框
                            window.location.href = "/travel/reserve/reserveAttractionsListUI";
                        }
                    } else {
                        layer.open({
                            title: '错误提示',
                            content: result.message
                        });
                    }
                }
            })
        }
    </script>
</div>

</html>
